<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>注册</title>
    <%@include file="/link/link-head.jsp" %>
</head>
<body>

<form action="${pageContext.request.contextPath}/teacher/register" method="post">
    <table>
        <tr>
            <th>称呼</th>
            <td>
                <input type="text" placeholder="真实姓名" name="salutation">
            </td>
        </tr>
        <tr>
            <th>手机号</th>
            <td>
                <input type="text" placeholder="真实手机号" name="phone">
            </td>
        </tr>
        <tr>
            <th>邮件</th>
            <td>
                <input type="email" placeholder="用户接收验证码" name="email">
            </td>
        </tr>
        <tr>
            <th>用户名</th>
            <td>
                <input type="text" placeholder="登录用户名" name="name">
            </td>
        </tr>
        <tr>
            <th>密码</th>
            <td>
                <input type="password" placeholder="登录的密码" name="pwd">
            </td>
        </tr>
        <tr>
            <td>
                <button type="button" onclick="sendEmailCode()">发送验证码</button>
            </td>
            <td>
                <input type="text" placeholder="请输入六位验证码" name="phoneCode" onchange="checkCode()">
                <span style="color: red" id="codems"></span>
            </td>
        </tr>
        <tr>
            <th>
                <button type="submit" disabled="disabled">注册</button>
            </th>
            <th>
                <button type="reset">重新填写</button>
            </th>
        </tr>
    </table>
</form>

<a href="login.jsp">登录</a>
</body>
<script>
    //发送邮箱验证码
    function sendEmailCode() {
        //获取 email 标签
        let $input = $("input[type=email]");
        //获取 email
        let email = $input.val();
        //提示信息
        let $codems = $("#codems");
        //非空拍段
        if (email !== '' && email !== undefined) {
            //发送 ajax
            $.ajax({
                url: "${pageContext.request.contextPath}/teacher/sendEmail",
                data: {"email": email},
                type: "post",
                success: function (data) {
                    if (data == 1) {
                        $codems.text("发送成功");
                    } else {
                        $codems.text("发送失败");
                    }
                },
                error: function () {
                    $codems.text("服务器错误");
                }
            })
        }
    }

    //检查 验证码是否正确
    function checkCode() {
        let $input = $("input[name='phoneCode']");
        let code = $input.val();
        //提示信息
        let $codems = $("#codems");
        if (code !== '' && code !== undefined) {
            $.ajax({
                url: "${pageContext.request.contextPath}/teacher/checkEmailCode",
                data: {"ecode": code},
                type: "post",
                success: function (data) {
                    if (data == 1) {
                        $codems.text("验证码正确");
                        $('button[type=submit]').removeAttr("disabled");
                    } else if (data == 0) {
                        $codems.text("验证码错误");
                    }
                },
                error: function () {
                    $codems.text("服务器错误");
                }
            })
        }
    }
</script>
</html>
